
<!doctype html>
<!--
* SoloX - real-time collection tool for Android/iOS performance data.
* @Author Rafa Chen
* Copyright SoloX
-->
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
    <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
    <title>SoloX -  Analysis </title>
    <!-- CSS files -->
    <link rel="icon" href="https://cdn.nlark.com/yuque/0/2024/png/153412/1715849982577-44b84a9c-e4d8-46b0-acae-dc46eb2ad2c9.png?x-oss-process=image%2Fformat%2Cwebp">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tabler/core@latest/dist/css/tabler.min.css">
</head>
<body class="Body layout-boxed">
    <div class="page">
        <header class="navbar navbar-expand-md navbar-light d-print-none">
            <div class="container-xl" style="margin-top: 15px;margin-bottom: 15px;">
                <div class="input-group" >
                    <span class="input-group-text">
                        <strong>APP</strong>
                    </span>
                    <input type="text" class="form-control" disabled value="{{ app }}"  autocomplete="off">
                </div>
                <div class="input-group" style="margin-left: 10px;">
                    <span class="input-group-text">
                        <strong>Platform</strong>
                    </span>
                    <input type="text" class="form-control" disabled value="{{ platform }}"  autocomplete="off">
                </div>
                <div class="input-group" style="margin-left: 10px;">
                    <span class="input-group-text">
                        <strong>Device</strong>
                    </span>
                    <input type="text" class="form-control" disabled  value="{{ devices }}" autocomplete="off">
                </div>
                <div class="input-group" style="margin-left: 10px;">
                    <span class="input-group-text">
                        <strong>CTime</strong>
                    </span>
                    <input type="text" class="form-control" disabled  value="{{ ctime }}"  autocomplete="off">
                </div>
            </div>
        </header>
        <div class="page-wrapper sceen-body">
            <div class="page-body">
                <div class="container-xl">
                    <div class="col-12 mb-3">
                        <div class="row row-cards">
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-dark text-white avatar">CPU</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">APP</div>
                                                <div class="text-muted">Avg: {{ cpu_app }}</div>
                                            </div> 
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-dark text-white avatar">CPU</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">Total</div>
                                                <div class="text-muted">Avg: {{ cpu_sys }}</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-purple text-white avatar">GPU</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">GPU</div>
                                                <div class="text-muted">Avg: {{ gpu }}%</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-yellow text-white avatar">MEM</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">Total</div>
                                                <div class="text-muted">Avg: {{ mem_total }}</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-pink text-white avatar">FPS</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">FPS</div>
                                                <div class="text-muted">Avg: {{ fps }}</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-green text-white avatar">BAT</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">Temperature</div>
                                                <div class="text-muted">Final: {{ tem }}</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-green text-white avatar">BAT</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">Current</div>
                                                <div class="text-muted">Avg: {{ current }}mA</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-green text-white avatar">BAT</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">Voltage</div>
                                                <div class="text-muted">Avg: {{ voltage }}mW</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-green text-white avatar">BAT</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">Power</div>
                                                <div class="text-muted">Avg: {{ power }}mV</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-blue text-white avatar">NET</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">Send</div>
                                                <div class="text-muted">All: <label style="color: red;"><strong>+</strong></label>{{ net_send }}</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-sm-6 col-lg-2">
                                <div class="card card-sm">
                                    <div class="card-body">
                                        <div class="row align-items-center">
                                            <div class="col-auto">
                                                <span class="bg-blue text-white avatar">NET</span>
                                            </div>
                                            <div class="col">
                                                <div class="font-weight-medium">Recv</div>
                                                <div class="text-muted">All: <label style="color: red;"><strong>+</strong></label>{{ net_recv }}</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-12">
                        <div class="card cpu-card mb-3">
                            <div class="card-header">
                                <div class='card-title'>CPU Usage (%)</div>
                                <div class="card-actions btn-actions">
                                    <a class="btn-action cursor-pointer"  onclick="screenshot('cpu-card','cpu.png')">
                                        <svg t="1646303797379" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5790" width="2000" height="2000"><path d="M897.856 842.56c14.464-6.72 18.624-20.48 9.28-30.848l-241.216-263.296a25.792 25.792 0 0 0-7.68-5.888c-14.016-7.296-33.6-5.184-43.776 4.8l-241.152 233.088-103.808-70.528a30.912 30.912 0 0 0-3.52-1.92c-14.08-7.36-33.664-4.992-43.776 4.864l-101.056 97.728a18.368 18.368 0 0 0-6.08 13.952c0.512 12.288 14.848 22.016 32.128 21.696h732.8a40.768 40.768 0 0 0 17.856-3.648zM259.84 399.68a78.464 78.464 0 0 0 117.504 67.84 78.272 78.272 0 0 0 0-135.744A78.208 78.208 0 0 0 259.84 399.68" p-id="5791"></path><path d="M864.832 872.256H159.232a83.84 83.84 0 0 1-83.776-83.776V235.52a83.84 83.84 0 0 1 83.776-83.776h705.536a83.84 83.84 0 0 1 83.776 83.776v552.96a83.84 83.84 0 0 1-83.712 83.776zM159.232 183.744a51.84 51.84 0 0 0-51.776 51.776v552.96a51.84 51.84 0 0 0 51.776 51.776h705.536a51.84 51.84 0 0 0 51.776-51.776V235.52a51.84 51.84 0 0 0-51.776-51.776H159.232z" p-id="5792"></path></svg>
                                    </a>
                                </div>
                            </div>
                            <div class="card-body">
                                <div id="chart-cpu"></div>
                            </div>
                        </div>
                        <div class="card gpu-card mb-3">
                            <div class="card-header">
                                <div class='card-title'>GPU Usage (%)</div>
                                <div class="card-actions btn-actions">
                                    <a class="btn-action cursor-pointer"  onclick="screenshot('gpu-card','gpu.png')">
                                        <svg t="1646303797379" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5790" width="2000" height="2000"><path d="M897.856 842.56c14.464-6.72 18.624-20.48 9.28-30.848l-241.216-263.296a25.792 25.792 0 0 0-7.68-5.888c-14.016-7.296-33.6-5.184-43.776 4.8l-241.152 233.088-103.808-70.528a30.912 30.912 0 0 0-3.52-1.92c-14.08-7.36-33.664-4.992-43.776 4.864l-101.056 97.728a18.368 18.368 0 0 0-6.08 13.952c0.512 12.288 14.848 22.016 32.128 21.696h732.8a40.768 40.768 0 0 0 17.856-3.648zM259.84 399.68a78.464 78.464 0 0 0 117.504 67.84 78.272 78.272 0 0 0 0-135.744A78.208 78.208 0 0 0 259.84 399.68" p-id="5791"></path><path d="M864.832 872.256H159.232a83.84 83.84 0 0 1-83.776-83.776V235.52a83.84 83.84 0 0 1 83.776-83.776h705.536a83.84 83.84 0 0 1 83.776 83.776v552.96a83.84 83.84 0 0 1-83.712 83.776zM159.232 183.744a51.84 51.84 0 0 0-51.776 51.776v552.96a51.84 51.84 0 0 0 51.776 51.776h705.536a51.84 51.84 0 0 0 51.776-51.776V235.52a51.84 51.84 0 0 0-51.776-51.776H159.232z" p-id="5792"></path></svg>
                                    </a>
                                </div>
                            </div>
                            <div class="card-body">
                                <div id="chart-gpu"></div>
                            </div>
                        </div>
                        <div class="card memory-card mb-3">
                            <div class="card-header">
                                <div class='card-title'>Memory Usage (MB)</div>
                                <div class="card-actions btn-actions">
                                    <a class="btn-action cursor-pointer"  onclick="screenshot('memory-card','memery.png')">
                                        <svg t="1646303797379" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5790" width="2000" height="2000"><path d="M897.856 842.56c14.464-6.72 18.624-20.48 9.28-30.848l-241.216-263.296a25.792 25.792 0 0 0-7.68-5.888c-14.016-7.296-33.6-5.184-43.776 4.8l-241.152 233.088-103.808-70.528a30.912 30.912 0 0 0-3.52-1.92c-14.08-7.36-33.664-4.992-43.776 4.864l-101.056 97.728a18.368 18.368 0 0 0-6.08 13.952c0.512 12.288 14.848 22.016 32.128 21.696h732.8a40.768 40.768 0 0 0 17.856-3.648zM259.84 399.68a78.464 78.464 0 0 0 117.504 67.84 78.272 78.272 0 0 0 0-135.744A78.208 78.208 0 0 0 259.84 399.68" p-id="5791"></path><path d="M864.832 872.256H159.232a83.84 83.84 0 0 1-83.776-83.776V235.52a83.84 83.84 0 0 1 83.776-83.776h705.536a83.84 83.84 0 0 1 83.776 83.776v552.96a83.84 83.84 0 0 1-83.712 83.776zM159.232 183.744a51.84 51.84 0 0 0-51.776 51.776v552.96a51.84 51.84 0 0 0 51.776 51.776h705.536a51.84 51.84 0 0 0 51.776-51.776V235.52a51.84 51.84 0 0 0-51.776-51.776H159.232z" p-id="5792"></path></svg>
                                    </a>
                                </div>
                            </div>
                            <div class="card-body">
                                <div id="chart-mem"></div>
                            </div>
                        </div>
                        <div class="card net-card mb-3">
                            <div class="card-header">
                                <div class='card-title'>Network Usage (KB)</div>
                                <div class="card-actions btn-actions">
                                    <a class="btn-action cursor-pointer"  onclick="screenshot('net-card','net.png')">
                                        <svg t="1646303797379" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5790" width="2000" height="2000"><path d="M897.856 842.56c14.464-6.72 18.624-20.48 9.28-30.848l-241.216-263.296a25.792 25.792 0 0 0-7.68-5.888c-14.016-7.296-33.6-5.184-43.776 4.8l-241.152 233.088-103.808-70.528a30.912 30.912 0 0 0-3.52-1.92c-14.08-7.36-33.664-4.992-43.776 4.864l-101.056 97.728a18.368 18.368 0 0 0-6.08 13.952c0.512 12.288 14.848 22.016 32.128 21.696h732.8a40.768 40.768 0 0 0 17.856-3.648zM259.84 399.68a78.464 78.464 0 0 0 117.504 67.84 78.272 78.272 0 0 0 0-135.744A78.208 78.208 0 0 0 259.84 399.68" p-id="5791"></path><path d="M864.832 872.256H159.232a83.84 83.84 0 0 1-83.776-83.776V235.52a83.84 83.84 0 0 1 83.776-83.776h705.536a83.84 83.84 0 0 1 83.776 83.776v552.96a83.84 83.84 0 0 1-83.712 83.776zM159.232 183.744a51.84 51.84 0 0 0-51.776 51.776v552.96a51.84 51.84 0 0 0 51.776 51.776h705.536a51.84 51.84 0 0 0 51.776-51.776V235.52a51.84 51.84 0 0 0-51.776-51.776H159.232z" p-id="5792"></path></svg>
                                    </a>
                                </div>
                            </div>
                            <div class="card-body">
                                <div id="chart-net"></div>
                            </div>
                        </div>
                        <div class="card fps-card mb-3">
                            <div class="card-header">
                                <div class='card-title'>FPS (HZ)</div>
                                <div class="card-actions btn-actions">
                                    <a class="btn-action cursor-pointer"  onclick="screenshot('fps-card','fps.png')">
                                        <svg t="1646303797379" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5790" width="2000" height="2000"><path d="M897.856 842.56c14.464-6.72 18.624-20.48 9.28-30.848l-241.216-263.296a25.792 25.792 0 0 0-7.68-5.888c-14.016-7.296-33.6-5.184-43.776 4.8l-241.152 233.088-103.808-70.528a30.912 30.912 0 0 0-3.52-1.92c-14.08-7.36-33.664-4.992-43.776 4.864l-101.056 97.728a18.368 18.368 0 0 0-6.08 13.952c0.512 12.288 14.848 22.016 32.128 21.696h732.8a40.768 40.768 0 0 0 17.856-3.648zM259.84 399.68a78.464 78.464 0 0 0 117.504 67.84 78.272 78.272 0 0 0 0-135.744A78.208 78.208 0 0 0 259.84 399.68" p-id="5791"></path><path d="M864.832 872.256H159.232a83.84 83.84 0 0 1-83.776-83.776V235.52a83.84 83.84 0 0 1 83.776-83.776h705.536a83.84 83.84 0 0 1 83.776 83.776v552.96a83.84 83.84 0 0 1-83.712 83.776zM159.232 183.744a51.84 51.84 0 0 0-51.776 51.776v552.96a51.84 51.84 0 0 0 51.776 51.776h705.536a51.84 51.84 0 0 0 51.776-51.776V235.52a51.84 51.84 0 0 0-51.776-51.776H159.232z" p-id="5792"></path></svg>
                                    </a>
                                </div>
                            </div>
                            <div class="card-body">
                                <div id="chart-fps"></div>
                            </div>
                        </div>
                        <div class="card battery-card">
                            <div class="card-header">
                                <div class='card-title'>Battery</div>
                                <div class="card-actions btn-actions">
                                    <a class="btn-action cursor-pointer"  onclick="screenshot('battery-card','battery.png')">
                                        <svg t="1646303797379" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5790" width="2000" height="2000"><path d="M897.856 842.56c14.464-6.72 18.624-20.48 9.28-30.848l-241.216-263.296a25.792 25.792 0 0 0-7.68-5.888c-14.016-7.296-33.6-5.184-43.776 4.8l-241.152 233.088-103.808-70.528a30.912 30.912 0 0 0-3.52-1.92c-14.08-7.36-33.664-4.992-43.776 4.864l-101.056 97.728a18.368 18.368 0 0 0-6.08 13.952c0.512 12.288 14.848 22.016 32.128 21.696h732.8a40.768 40.768 0 0 0 17.856-3.648zM259.84 399.68a78.464 78.464 0 0 0 117.504 67.84 78.272 78.272 0 0 0 0-135.744A78.208 78.208 0 0 0 259.84 399.68" p-id="5791"></path><path d="M864.832 872.256H159.232a83.84 83.84 0 0 1-83.776-83.776V235.52a83.84 83.84 0 0 1 83.776-83.776h705.536a83.84 83.84 0 0 1 83.776 83.776v552.96a83.84 83.84 0 0 1-83.712 83.776zM159.232 183.744a51.84 51.84 0 0 0-51.776 51.776v552.96a51.84 51.84 0 0 0 51.776 51.776h705.536a51.84 51.84 0 0 0 51.776-51.776V235.52a51.84 51.84 0 0 0-51.776-51.776H159.232z" p-id="5792"></path></svg>
                                    </a>
                                </div>
                            </div>
                            <div class="card-body">
                                <div id="chart-battery"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <footer class="footer footer-transparent d-print-none">
            <div class="container-xl">
                <div class="row text-center align-items-center flex-row-reverse">
                    <div class="col-12  mt-3 mt-lg-0">
                        <ul class="list-inline list-inline-dots mb-0">
                            <li class="list-inline-item">Copyright &copy; <label id="curYear"></label>
                                <a href="https://github.com/smart-test-ti" class="link-secondary">SoloX</a>. All rights reserved 
                            </li>
                            <li class="list-inline-item">
                                <a href="https://github.com/smart-test-ti/SoloX" target="_blank" class="link-secondary" rel="noopener">
                                    <svg t="1703151647587" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4765" width="50" height="50"><path d="M512.09998 0.09998l-445.512985 239.953135 445.512985 247.251708 445.512986-247.251708z" fill="#8FB3FF" p-id="4766"></path><path d="M546.693224 546.593244l409.919937-242.752588-0.09998 482.805702-409.919937 237.353642 0.09998-477.406756z" fill="#043EB8" p-id="4767"></path><path d="M66.886936 303.840656L476.906854 542.893966l-0.499902 480.906073L66.786956 790.245655l0.09998-486.404999z" fill="#2868F0" p-id="4768"></path></svg>
                                    Source Code
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </footer>
    </div>

<!-- JQ JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<!-- tabler -->
<script src="https://cdn.jsdelivr.net/npm/@tabler/core@latest/dist/js/tabler.min.js"></script>
<!-- Sweetalert2 -->
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<!-- Apexcharts-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/apexcharts/3.39.0/apexcharts.min.js"></script>
<!-- html2canvas -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
<script>

    $(document).ready(function() {
        $('#curYear').text(getCurDate())
        initCPUCharts()
        initMemoryCharts()
        initNetworkCharts()
        initFPSCharts()
        initGPUCharts()
        initBatteryCharts()
    });

    function getCurDate(){
        var date = new Date();
        var year = date.getFullYear();
        return year
    };

    function screenshot(classname,downloadname) {
        let container = document.getElementsByClassName(classname); //page-wrapper
        html2canvas(container[0]).then(canvas => {
            let imgData = canvas.toDataURL();
            let link = document.createElement('a');
            link.href = imgData;
            link.download = downloadname;
            let flag = link.click();
            console.log(flag);
        })
    }

    function options(type,dataLabels=false) {
        let options = {
            chart: {
                type: type,
                fontFamily: 'inherit',
                height: 240,
                parentHeightOffset: 0,
                toolbar: {
                    show: false,
                },
                animations: {
                    enabled: false
                },
            },
            dataLabels: {
                enabled: dataLabels
            },
            fill: {
                opacity: 1
            },
            stroke: {
                width: 2,
                lineCap: "round",
                curve: "smooth",
            },
            series: [],
            grid: {
                padding: {
                    top: -20,
                    bottom: -4
                },
            strokeDashArray: 4,
            },
            xaxis: {
                name: "time",
                tickAmount:6,
                labels: {
                    rotate: 0,
                }
            },
        };
        return options
    }

    function initCPUCharts(){
        var cpu_chart = new ApexCharts(document.querySelector("#chart-cpu"), options('line'));
        cpu_chart.render();
        cpu_chart.updateSeries([{
            name: 'app',
            data: {{ cpu_charts.cpuAppData }}
        },{
            name: 'total',
            data: {{ cpu_charts.cpuSysData }}
        }])
    }

    
    function initMemoryCharts(){
        var mem_chart = new ApexCharts(document.querySelector("#chart-mem"), options('line'));
        mem_chart.render();
        mem_chart.updateSeries([{
            name: 'total',
            data: {{ mem_charts.memTotalData }}
        }])
    }

    function initNetworkCharts(){
        var network_chart = new ApexCharts(document.querySelector("#chart-net"), options('line',false));
        network_chart.render();
        network_chart.updateSeries([{
            name: 'send',
            data: {{ net_charts.upFlow }}
        },{
            name: 'recieve',
            data: {{ net_charts.downFlow }}
        }])
    }
   
    function initFPSCharts(){
        var fps_chart = new ApexCharts(document.querySelector("#chart-fps"), options('line'));
        fps_chart.render();
        fps_chart.updateSeries([{
            name: 'fps',
            data: {{ fps_charts.fps }}
        }])
    }
    

    function initGPUCharts(){
        var gpu_chart = new ApexCharts(document.querySelector("#chart-gpu"), options('line'));
        gpu_chart.render();
        gpu_chart.updateSeries([{
            name: 'gpu',
            data: {{ gpu_charts.gpu }}
        }])
    }

    function initBatteryCharts(){
        var battery_chart = new ApexCharts(document.querySelector("#chart-battery"), options('line'));
        battery_chart.render();
        battery_chart.updateSeries([{
            name: 'temperature',
            data: {{ battery_charts.batteryTem }}
        },{
            name: 'current',
            data: {{ battery_charts.batteryCurrent }}
        },{
            name: 'voltage',
            data: {{ battery_charts.batteryVoltage }}
        },{
            name: 'power',
            data: {{ battery_charts.batteryPower }}
        }])
    }

</script>

</body>
</html>